<template>
  <div class="userconfirm">
    <topHeader>
      <div slot="left">
        <img src="./../../assets/img/return.png" alt="" @click="goMine">
      </div>
      <span slot="center">
        车主认证
      </span>
    </topHeader>
    <div class="userconfirm_con">
      <!-- <div class="car_box">
        <div class="title">
          姓名
        </div>
        <div class="input_box">
          <input type="text" placeholder="请输入您的真实姓名" v-model="params.name">
        </div>
      </div> -->
      <div class="car_box">
        <div class="title">
          车牌号
        </div>
        <div class="input_box">
          <input type="text" placeholder="请输入您的车牌号" v-model="params.driverCardNum">
        </div>
      </div>
      <div class="car_box">
        <div class="title">
          车辆类型
        </div>
        <div class="input_box">
          <input type="text" placeholder="例如：雪佛兰科鲁兹" v-model="params.carType">
        </div>
      </div>
      <div class="idcard_img_box">
        <div class="idcard_img_title">
          驾驶证照
        </div>
        <div class="idcard_img">
          <img src="./../../assets/img/zhengmian.png" alt="" v-if="driverCardASrc1===null">
          <img :src="driverCardASrc1" v-else>
          <input type="file" accept="image" ref="inputer" @change="handleFileChange">
        </div>
      </div>
      <div class="idcard_img_box">
        <div class="idcard_img_title">
          行驶证照
        </div>
        <div class="idcard_img">
          <img src="./../../assets/img/zhengmian.png" alt="" v-if="driverCardBSrc1===null">
          <img :src="driverCardBSrc1" v-else>
          <input type="file" accept="image" ref="inputer1" @change="handleFileChange1">
        </div>
      </div>
      <div class="summit_btn" @click="sumitIdCard">
        提交认证
      </div>
    </div>
  </div>
</template>

<script>
/* eslint-disable */
import{ driverConfirm, driverCardConfirm, userIdAuthority } from '@/api/allapis'
import topHeader from './../../components/topHeader'
export default {
  data () {
    return {
      params:{
        driverCardA:{},
        driverCardB:{},
        carType:'',
        driverCardNum:'',
        userId:''
      },
      driverCardASrc: null,
      driverCardASrc1: null,
      driverCardBSrc: null,
      driverCardBSrc1: null
    }
  },

  components: {
    topHeader
  },
  watch:{
    driverCardASrc(newVal, oldVal){
      this.driverCardASrc1 = newVal
    },
    driverCardBSrc(newVal, oldVal){
      this.driverCardBSrc1 = newVal
    }
  },
  computed: {},

  mounted () {},

  methods: {
    alertMessage () {
      this.$vux.alert.show({
        title: '人人同行提示',
        content: '',
        buttonText: '好的',
        hideOnBlur: true,
        maskZIndex: 100
      })
    },
    goMine () {
      this.$router.go(-1)
    },
    handleFileChange (e) {
      let self = this
      let inputDOM = this.$refs.inputer
      this.params.driverCardA = inputDOM.files[0]
      let files = e.target.files || e.dataTransfer.files;
      if (!files.length) return;
      let file = files[0];
      let reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = function (e) {
        file["base64"] = e.target.result;
        self.driverCardASrc = file["base64"]
      }
      // if (this.params.driverCardA) {
      //   // this.uploadIMG()
      //   this.driverCardASrc = this.getObjectURL(inputDOM.files[0])
      //   console.log(this.driverCardASrc)
      //   console.log(this.params.driverCardA)
      // }
    },
    handleFileChange1 (e) {
      let self = this
      let inputDOM = this.$refs.inputer1
      this.params.driverCardB = inputDOM.files[0]
      let files = e.target.files || e.dataTransfer.files;
      if (!files.length) return;
      let file = files[0];
      let reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = function (e) {
        file["base64"] = e.target.result;
        self.driverCardBSrc = file["base64"]
      }
      // this.driverCardBSrc = this.getObjectURL(inputDOM.files[0])
      // if (this.params.driverCardB) {
      //   // this.uploadIMG()
      //   console.log(this.params.driverCardB)
      // }
    },
    getObjectURL(file) {
      var url = null ;
      if (window.createObjectURL!=undefined) { // basic
        url = window.createObjectURL(file) ;
      } else if (window.URL!=undefined) { // mozilla(firefox)
        url = window.URL.createObjectURL(file) ;
      } else if (window.webkitURL!=undefined) { // webkit or chrome
        url = window.webkitURL.createObjectURL(file) ;
      }
      return url ;
    },
    async sumitIdCard () {
      this.params.userId = this.$store.state.user.uerInfo.id
      this.$vux.loading.show({ text: '认证中' })
      await userIdAuthority({ userID: this.$store.state.user.uerInfo.id }).then(res => {
        if (res.data === '身份证未认证') {
          // alert('请先去认证身份证')
          this.$vux.alert.show({
            title: '人人同行提示',
            content: '请先认证身份证',
            buttonText: '好的',
            hideOnBlur: true,
            maskZIndex: 100
          })
          this.$router.push({ name: 'userconfirm' })
        }
      })
      driverCardConfirm(this.params).then(res => {
        console.log(res)
        this.$vux.loading.hide()
        if(res.data === "行驶证认证成功") {
          driverConfirm(this.params).then(res => {
            console.log(res)
            this.$vux.alert.show({
              title: '人人同行提示',
              content: '认证成功',
              buttonText: '好的',
              hideOnBlur: true,
              maskZIndex: 100
            })
            this.$router.push('confirmsuccess')
          })
        }else {
            this.$vux.alert.show({
              title: '人人同行提示',
              content: res.data,
              buttonText: '好的',
              hideOnBlur: true,
              maskZIndex: 100
            })
            this.$vux.loading.hide()
        }
      })
    }
  }
}

</script>
<style lang='less' scoped>
@import url('./driverconfirm.less');
</style>